import Stats from './stats.module.js'
import './OrbitControls.js'

/**
 * 初始化基础元素
 * @param { HTMLDIVElement } element 容器
 * @returns 基础元素
 * * scene
 * * camera
 * * renderer
 */
export const createBaseObj = (element) => {
  const oWidth = element.clientWidth
  const oHeight = element.clientHeight
  const widthAndHeight = oWidth / oHeight

  const scene = new THREE.Scene()
  const camera = new THREE.PerspectiveCamera(45, widthAndHeight, 1000, 0.1)
  const renderer = new THREE.WebGLRenderer()
  renderer.setSize(oWidth, oHeight)
  element.appendChild(renderer.domElement)
  camera.position.set(100, 100, 100)
  camera.lookAt(0, 0, 0)

  return {
    scene,
    camera,
    renderer,
  }
}

/**
 *
 * @param {*} domElement 绑定DOM元素
 * @param {*} cameraOpt 相机配置
 * @param {*} isHasAxesHelper 是否开启配置
 * @param {*} isHasState 是否开启调试
 */
export const initBase = (
  domElement,
  cameraOpt,
  isHasAxesHelper,
  isHasState
) => {
  if (isHasAxesHelper) {
  }

  if (isHasState) {
  }
}

/** 创建随机笛卡尔点位 */
export const getRanderPoint = (numX = 100, numY = numX, numZ = numX) => {
  const x = Math.floor(Math.random() * numX)
  const y = Math.floor(Math.random() * numY)
  const z = Math.floor(Math.random() * numZ)

  return new THREE.Vector3(x, y, z)
}

export const getStats = () => {
  return new Stats()
}

/**
 * 添加性能检测
 * @param {*} element HTML元素
 * @returns 
 */
export const addFPSObject = (element) => {
  const stats = new Stats()
  element.appendChild(stats.domElement)
  return stats
}

/**
 * 添加坐标辅助线
 * * 红色 X
 * * 绿色 Y
 * * 蓝色 Z
 */
export const addHelpLine = (scene, length = 100) => {
  const line = new THREE.AxesHelper(length)
  scene.add(line)
}

/**
 * 连续使用，获取渲染
 * @param {*} baseObj
 * @param {*} callback
 * @returns
 */
export const testAnimation = ({ scene, camera, renderer }, callback) => {
  return function test() {
    const RAF = requestAnimationFrame(test)
    callback()
    renderer.render(scene, camera)
    return RAF
  }
}

/**
 * 创建视图控制器
 */
export const createViewController = (canvasElement, camera) => {
  return new THREE.OrbitControls(camera, canvasElement)
}

/**
 * 创建简单的盒子
 * @param {*} position 
 * @param {*} size 
 * @param {*} color 
 */
export const createEasyBox = (position, size, color) => {
  const geometry = new THREE.BoxGeometry(size, size, size)
  const material = new THREE.MeshLambertMaterial({ color })
  const box = new THREE.Mesh(geometry, material)
  box.position.set(position.x, position.y, position.z)
  return box
}

export default {
  createBaseObj,
  getRanderPoint,
  getStats,
}
